<!--楼宇设备-->
<template>
  <div class="main">
        <basic-layout title="楼宇设备修改" :showAddBtn="false">
<!--    <fullscreenModal :modal="fullscreenModal" defaultBgColor="#eee" label="修改" @handleClose="fullscreenModal = false">-->
      <div class="columnFlex">
        <van-form class="dataStyle" @submit="saveHandle" ref="form">
          <van-field :readonly="true" :disabled="true" v-model="dataInfo.louysbxx.SWID" label="实物ID" placeholder=""
                     :border="false"/>
          <van-field required v-model="dataInfo.louysbxx.SBMC" label="设备名称" placeholder="请输入设备名称" :border="false"
                     :rules="rules.SBMC"></van-field>
          <van-field name="设备型号" label="设备型号" required v-model="dataInfo.louysbxx.SBXH"
                     placeholder="请输入设备型号"></van-field>
          <van-field name="设备编号" label="设备编号" required v-model="dataInfo.louysbxx.SBBH"
                     placeholder="请输入设备编号"></van-field>
          <van-field name="资产原值(元)" label="资产原值(元)" required v-model="dataInfo.louysbxx.ZCYZ"
                     placeholder="请输入资产原值(元)"></van-field>
          <van-field readonly required @click="showDialogHandle(1)" v-model="dataInfo.louysbxx.SBDL" label="设备大类"
                     placeholder="请选择设备大类" :border="false" is-link :rules="rules.SBDL"/>
          <van-field readonly clickable name="设备小类" label="设备小类" v-model="dataInfo.louysbxx.SBXL" placeholder="请选择设备小类"
                     required @click="showDialogHandle(2)" :border="false" is-link :rules="rules.SBXL"></van-field>
          <van-field :readonly="true" :disabled="true"   name="所属楼宇" label="所属楼宇" v-model="dataInfo.louysbxx.LOUYMC"
                     placeholder=""></van-field>
          <van-field name="生产厂家" label="生产厂家" required v-model="dataInfo.louysbxx.SCCJ"
                     placeholder="请输入生产厂家"></van-field>
          <van-field :readonly="true" :disabled="true" v-model="dataInfo.louysbxx.CCSJ" label="出厂时间" placeholder=""/>
          <van-field :readonly="true" :disabled="true" v-model="dataInfo.louysbxx.TYRQ" label="投运日期" placeholder=""/>
          <van-field required v-model="dataInfo.louysbxx.SHIYNX" label="设计年限(年)" placeholder="请输入设计年限"
                     :rules="rules.SHIYNX"/>
          <van-field :readonly="true" :disabled="true" v-model="dataInfo.getcaigpcMap.CAIGPC" label="采购批次"
                     placeholder=""/>
          <van-field :readonly="true" :disabled="true" v-model="dataInfo.louysbxx.ZHUANGT" label="运行状态" placeholder=""/>
          <div class="remarkDownTextStyle">
            <div>&nbsp;&nbsp;&nbsp;&nbsp;备注</div>
            <van-field
              v-model="dataInfo.louysbxx.BEIZ"
              rows="2"
              autosize
              label=""
              type="textarea"
              placeholder="请输入备注"
            />
          </div>
        </van-form>
        <van-action-sheet
          v-model="showPicker"
          cancel-text="取消"
          :actions="data.defaultData.dlDataList"
          @select="onConfirm"
        />
        <van-action-sheet
          v-model="smallPicker"
          cancel-text="取消"
          :actions="XLItem"
          @select="SubclassOnConfirm"
        />
        <div class="btnBox">
        <van-button type="primary" size="large" color="#4eb3e9" @click="saveHandle">保存</van-button>
        </div>
      </div>
          </basic-layout>
  </div>
</template>
<script>
import { getLbByType, getLouyByUser, getLouysbQuanxst, saveLouysb } from '@/api/srvAssurance/assetLabel/assetLabel'

export default {
  name: 'officeMaterialRegisterEdit',
  components: {},
  data () {
    return {
      fullscreenModal: false,
      loading: false,
      showPicker: false,
      smallPicker: false,
      XLItem:[],
      canteenCode:'',
      formData: {
        id: '',
        ssly: '',
        sbdl: '',
        sbxl: '',
        sbmc: '',
        sbxh: '',
        sbbh: '',
        sccj: '',
        ccsj: '',
        tyrq: '',
        zcyz: '',
        beiz: '',
        zhuangt: '',
        shiynx: '',
        caigpc: '',
        swid: '',
      },
      rules: {
        SBMC: [
          {
            required: true,
            message: '',
            trigger: 'onBlur'
          },
        ],
        SBXH: [
          {
            required: true,
            message: '',
            trigger: 'onBlur'
          },
        ],
        SBBH: [
          {
            required: true,
            message: '',
            trigger: 'onBlur'
          },
        ],
        ZCYZ: [
          {
            required: true,
            message: '',
            trigger: 'onBlur'
          },
        ],
        SBDL: [
          {
            required: true,
            message: '',
            trigger: 'onChange'
          },
        ],
        SBXL: [
          {
            required: true,
            message: '',
            trigger: 'onChange'
          },
        ],
        LOUYMC: [
          {
            required: true,
            message: '',
            trigger: 'onChange'
          },
        ],
        SCCJ: [
          {
            required: true,
            message: '',
            trigger: 'onBlur'
          },
        ],
        SHIYNX: [
          {
            required: true,
            message: '',
            trigger: 'onBlur'
          },
        ],
      },

      dataInfo: {
        louysbxx: {},
        getcaigpcMap: {},
        feisxmList: [],
      },
      showDialog: false,
      dialogTitle: '',
      searchVal: '',
      dialogData: [],
      dialogDataBack: [],
      data: {
        defaultData: {
          dlDataList: [], //大类数据
          xlDataList: [], //小类数据
          lyDataList: [], //楼宇数据
        },
        filterData: {
          dlDataList: [], //大类数据
          xlDataList: [], //小类数据
          lyDataList: [], //楼宇数据
        },
        chooseData: {
          chooseDlData: {},
          chooseXlData: {},
          chooseLyData: {},
        },
      },
      flag: null,
    }
  },

  created () {
    if (this.$router.history.current.query.id) {
      this.initData(this.$router.history.current.query.id)
    }
    this.initLbType()
    this.initLyData()
  },

  methods: {
    async initLbType () {
      let lbDatas = await getLbByType({ type: '0' })
      if (lbDatas.status == 0) {
        var dataList = lbDatas.data
        dataList.forEach(item => {
          if (item.parentCode == '') {
            this.data.defaultData.dlDataList.push(item)
          } else {
            this.data.defaultData.xlDataList.push(item)
          }
        })
      }
    },

    async initLyData () {
      let louYuDatas = await getLouyByUser(
        { corpid: sessionStorage.getItem('corpId'), }
      )
      if (louYuDatas.status == 0) {
        var dataList = louYuDatas.data
        dataList.forEach(item => {
          item.name = item.fangcname
          this.data.defaultData.lyDataList.push(item)
        })
      }
    },

    async initData (id) {
      let resData = await getLouysbQuanxst({ id: id })
      this.dataInfo = {}
      if (resData.status === 0) {
        this.dataInfo = resData.data
      }
    },

    saveHandle () {
      this.$refs.form
        .validate()
        .then(async () => {
          this.dealData()
          this.loading = true
          var res = await saveLouysb(this.formData)
          this.loading = false
          if (res.status === 0) {
            this.$toast('修改成功')
          }
        })
        .catch(() => {
          this.loading = false
        })
      this.isModal();
    },
    isModal() {
      this.$emit('goBack');
    },

    dealData () {
      this.formData.id = this.dataInfo.louysbxx.ID
      this.formData.ssly = this.dataInfo.louysbxx.SSLY
      this.formData.sbdl = this.dataInfo.louysbxx.SBDLID
      this.formData.sbxl = this.dataInfo.louysbxx.SBXLID
      this.formData.sbmc = this.dataInfo.louysbxx.SBMC
      this.formData.sbxh = this.dataInfo.louysbxx.SBXH
      this.formData.sbbh = this.dataInfo.louysbxx.SBBH
      this.formData.sccj = this.dataInfo.louysbxx.SCCJ
      this.formData.ccsj = this.dataInfo.louysbxx.CCSJ
      this.formData.tyrq = this.dataInfo.louysbxx.TYRQ
      this.formData.zcyz = this.dataInfo.louysbxx.ZCYZ
      this.formData.beiz = this.dataInfo.louysbxx.BEIZ
      this.formData.zhuangt = this.dataInfo.louysbxx.ZHUANGTID
      this.formData.shiynx = this.dataInfo.louysbxx.SHIYNX
      this.formData.caigpc = this.dataInfo.getcaigpcMap.BATCH1
      this.formData.swid = this.dataInfo.louysbxx.SWID
    },
    onConfirm(val) {
      this.dataInfo.louysbxx.SBDL = val.name;
      this.dataInfo.louysbxx.SBDLID = val.code;
      this.dataInfo.louysbxx.SBXLID = val.code;
      this.showPicker = false;
    },
    SubclassOnConfirm(val) {
      this.dataInfo.louysbxx.SBXL= val.name;
      this.dataInfo.louysbxx.SBXLID = val.code;
      this.smallPicker = false;
      this.XLItem = [];
    },
    showDialogHandle (val) {
      this.dialogDataBack = []
      if (val === 1) {
        this.showPicker = true;
        // 清空小类
        this.dataInfo.louysbxx.SBXL = null;
      } else if (val === 2) {
        if (!this.dataInfo.louysbxx.SBDLID) {
          this.$toast('请先选择大类')
          return
        }
        this.XLItem = [];
        // 处理小类数据
        let code = this.dataInfo.louysbxx.SBXLID
        this.data.defaultData.xlDataList.forEach((item) => {
          if (item.parentCode === code) {
            this.XLItem.push(item);
          }
        });
        this.smallPicker = true;
      } else if (val === 3) {
        this.dialogTitle = '请选择楼宇信息'
        this.dialogDataBack = [...this.data.defaultData.lyDataList]
      }
      this.showDialog = true
      this.flag = val
    },

    chooseHandle (item) {
      this.showDialog = false
      if (this.flag === 1) {
        this.dataInfo.louysbxx.SBDL = item.name
        this.dataInfo.louysbxx.SBDLID = item.code
      } else if (this.flag === 2) {
        this.dataInfo.louysbxx.SBXL = item.name
        this.dataInfo.louysbxx.SBXLID = item.code
      } else if (this.flag === 3) {
        this.dataInfo.louysbxx.SSLY = item.fangcid
        this.dataInfo.louysbxx.LOUYMC = item.name
      }
    },

    clearHandle () {
      this.showDialog = false
      if (this.flag === 1) {
        this.dataInfo.louysbxx.SBDL = null
        this.dataInfo.louysbxx.SBDLID = null

        this.dataInfo.louysbxx.SBXL = null
        this.dataInfo.louysbxx.SBXLID = null
      } else if (this.flag === 2) {
        this.dataInfo.louysbxx.SBXL = null
        this.dataInfo.louysbxx.SBXLID = null
      } else if (this.flag === 3) {
        this.dataInfo.louysbxx.ssly = null
        this.dataInfo.louysbxx.LOUYMC = null
      }
    },

    onUpdate (value) {
      value = value.trim()
      this.dialogDataBack = []
      let dialogData = []
      if (this.flag === 1) {
        dialogData = this.data.defaultData.dlDataList
      } else if (this.flag === 2) {
        dialogData = this.data.defaultData.xlDataList
      } else if (this.flag === 3) {
        dialogData = this.data.defaultData.lyDataList
      }
      if (value == null || value.trim() == '') {
        this.dialogDataBack = [...dialogData]
        return
      }
      if (value) {
        dialogData.forEach(i => {
          let val = { ...i }
          //判断遍历是否包含输入字符
          if (val.name.indexOf(value) != -1) {
            var newHtml = `<span style="color: red">${value}</span>`
            //实现高亮效果
            this.dialogDataBack.push(val)
            //替换高亮字段
            this.dialogDataBack.forEach(item => {
              item.value = item.name
              item.value = item.value.replace(value, newHtml)
            })
          }
        })
      }
    },
  }
}
</script>

<style scoped lang="less">
.dataStyle {
  height: calc(100% - 38px);
  overflow: auto;
}

.van-dialog {
  height: 70%;
}

.van-dialog__content {
  overflow-y: scroll;
  height: 90%;
}

.dialogDataStyle {
  text-align: center;
}
.parent-element {
  display: flex;
  justify-content: center;
}

.btnBox {
  width: 100%;
  position: fixed;
  bottom: 0px;
  height: 40px;
  margin: 20px auto;
  // padding: 0 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.btnBox /deep/ .van-button--large {
}

.van-button--large {
  height: 40px;
  line-height: 40px;
  width: 95%;
  margin: 10px auto;
}
</style>
